import * as THREE from '../../build/three.module.js';
import {
  OrbitControls
} from '../../jsm/controls/OrbitControls.js';

const scene = new THREE.Scene();

const k = innerWidth / innerHeight,
      s = 60,
      camera = new THREE.PerspectiveCamera(s, k, 1, 10000);
camera.position.set(400, 400, 400);
camera.lookAt(scene.position);

/**
 * 使用 ObjectLoader 实例加载外部 json 模型
 */
const loader = new THREE.ObjectLoader();
let mixer = null;
// 加载
loader.load('../../models/json/teapot-claraio.json', obj => {
  scene.add(obj);
  console.log(obj);
  // obj 作为混合器对象
  mixer = new THREE.AnimationMixer(obj);
  // obj.anmations[0] 获取剪辑对象
  const action = mixer.clipAction(mixer.animations[0]);
  action.play();
});

const al = new THREE.AmbientLight(0xffffff);
scene.add(al);

const axesH = new THREE.AxesHelper(400);
scene.add(axesH);

const renderer = new THREE.WebGLRenderer();
renderer.setClearColor(0xaaaaaa);
renderer.setSize(innerWidth, innerHeight);
document.body.appendChild(renderer.domElement);

new OrbitControls(camera, renderer.domElement);

const clock = new THREE.Clock();

(function render() {
  renderer.render(scene, camera);
  requestAnimationFrame(render);

  if (mixer) {
    mixer.update(clock.getDelta());
  }
})();